<template>
	<app-layout @cek="bind(id)">
		<image class="bind-image" :src="imgprefix + '/web/uploads/taskpopup/bind-bg.png?timeout=' + timeout"
			mode="widthFix">
		</image>
		<view class="bind-btn" v-if="nobind" @click="bind(id)">
			点击绑定
		</view>
		<!-- <view class="">
			绑定成功
		</view>
		<view class="" @click="bind(id)">
			点击绑定
		</view> -->
	</app-layout>
</template>

<script>
	export default {
		data() {
			return {
				id: 14,
				imgprefix: this.$siteInfo.imgroot,
				timeout: new Date().getTime(),
				nobind: false
			}
		},
		onLoad(options) {
			// this.id = options.id
			if (options.scene) {
				let params = decodeURIComponent(options.scene)
				let option = this.$utils.urlParamsToObject(params)
				this.id = option.id
			} else if (options.id) {
				this.id = options.id
			}
			this.bind(this.id)
		},
		methods: {
			bind(id) {
				if (this.$store.state.user.accessToken === '' || this.$store.state.user.accessToken === null) {
					this.$store.dispatch('user/accessToken');
					this.nobind = true
					return
				}
				this.$request({
					url: this.$apiSol.solitaire.binduser,
					data: {
						id: id
					}
				}).then((res) => {
					// console.log(res);
					if (res.msg == '保存成功') {
						this.nobind = false
						uni.showToast({
							title: '绑定成功',
							icon: 'none'
						})
					}
				}).catch(() => {
					this.nobind = true
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.bind-image {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		z-index: -1;
	}

	.bind-btn {
		position: fixed;
		left: 24rpx;
		bottom: 24rpx;
		width: 702rpx;
		height: 100rpx;
		line-height: 100rpx;
		border-radius: 54rpx;
		background: #09ba07;
		color: #FFF;
		text-align: center;
		margin-bottom: 36rpx;
		margin-bottom: constant(safe-area-inset-bottom);
		margin-bottom: env(safe-area-inset-bottom);
		z-index: 9;
	}
</style>
